.portfolio {
    padding-top: 120px;
    &__title {
        text-align: center;
    }
    &__subtitle {
        text-align: center;
    }
    &__wrapper {
        margin-top: 60px;
        display: grid;
        grid-template-columns: repeat(3, 364px);
        grid-template-rows: repeat(2, 280px);
        grid-auto-rows: 280px;
        gap: 24px;
    }
    &__item {
        display: block;
        position: relative;
        &:before {
            position: absolute;
            content: "";
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            border-radius: 10px;
            background-color:rgba(0,0,0,.3);
            opacity: 0;
            transition: 0.6s;
        }
        &:hover:before {
            opacity: 1;
        }
        img {
            width: 100%;
            border-radius: 10px;
            box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
        }
    }
}

 